<template>
  <div class="UploadImages">
    <uploader
      v-if="keyWord === 'goodsImageList'"
      :img-limit="limit"
      :default-data="goodsImageList"
      :key-word="keyWord"
      :before-upload="beforeUpload"
      :upload-succ="uploadSucc"
      :image-remove="imageRemove"
      :warn-txt="warnTxt"
    />
    <uploader
      v-else
      :img-limit="limit"
      :default-data="goodsDescImage"
      :key-word="keyWord"
      :before-upload="beforeUpload"
      :upload-succ="uploadSucc"
      :image-remove="imageRemove"
      :warn-txt="warnTxt"
    />
  </div>
</template>

<script>
import uploader from './components/uploader_list'
import { Base64 } from 'js-base64'

export default {
  name: 'UploadImages',
  components: {
    uploader
  },
  props: ['keyWord', 'limit'],
  data() {
    return {
      /* 补充图片 */
      goodsImageList: [], // 数组
      goodsDescImage: [],
      warnTxt: '图片宽高比为 4:3'// 上传组件右侧建议
    }
  },
  mounted() {
    this.getOssData()
  },
  methods: {
    /** 获取阿里云oss存储配置信息 */
    getOssData() {
      if (!this.$cookies.get('ossParams')) {
        const res = {
          oss_host_url: 'https://global-application-001.downline.cn',
          app_main_url: 'casekadingche.downline.cn',
          oss_accesskey: 'hgV5TOnVHZWvXYV98QMqm1Avt7Q3mD',
          oss_accessid: 'scj0YOTsBy74ZWGy'
        }
        const ossParams = {
          key: res['app_main_url'] + '/goods_image/',
          accesskey: res['oss_accesskey'],
          OSSAccessKeyId: res['oss_accessid']
        }
        this.$cookies.set('ossParams', Base64.encode(JSON.stringify(ossParams)))
      }
    },

    // 上传前，原上传组件方法
    // eslint-disable-next-line no-unused-vars
    beforeUpload(file) {

    },
    // 图片移除，index，参数file更改为移除的数组下标
    imageRemove(keyWord, index) {
      if (keyWord === 'goodsImageList') {
        this[keyWord].forEach((item, idx) => {
          if (index === idx) {
            item.is_online = 111
          }
          /* if (item.id_public_goods_image) {
              if (index === idx) {
                  item.is_online = 111;
              }
          }*/
        })
      } else {
        this[keyWord].splice(index, 1)
      }

      this.$emit('imagesData', this[keyWord], keyWord)
    },
    // 上传成功，index,res，参数file更改为上传成功/替换成功图片在列表中的下标
    uploadSucc(keyWord, index, res, type) {
      console.log(res)
      if (type && type === 'add') {
        this[keyWord].push(res)
        this.$emit('imagesData', this[keyWord], keyWord)
      } else if (type && type === 'replace') {
        this[keyWord].splice(index, 1, res)
      }
    },

    handleRemove(file) {
      this.$refs.pictureUpload.handleRemove(file)
    }
  }
}
</script>

<style scoped lang="less">

</style>
